{{template "admin/header.html"}}
<style>
	.layui-form-label {
	  width: 130px;
	}
	.layui-input-block {
	  margin-left: 160px;
	}
</style>

<title>{{T "Update Settings"}}  - GPRESS</title>

<script type="text/javascript" src="{{basePath}}admin/js/sha3.min.js"></script>
{{template "admin/bodystart.html"}}
        <div class="layui-card layui-panel" style="height: 100%;">
          <div class="layui-card-header">
            {{T "Update Settings"}} 
          </div>
          <div class="layui-card-body">
            <form class="layui-form" id="gpress-form" action="{{basePath}}admin/{{.UrlPathParam}}/update" method="POST">
				<div class="layui-form-item layui-col-md6">
				  <label class="layui-form-label">ID</label>
				  <div class="layui-input-block">
					<input type="hidden" name="id" id="id" value="{{.Data.Id}}" />
					
				    <input type="hidden" name="sortNo" id="sortNo" value=1 />
				    <input type="hidden" name="status" id="status" value=1 />
					<input type="text" class="layui-input" disabled value="{{.Data.Id}}" />
				  </div>
				</div>
				<div class="layui-form-item layui-col-md6">
					<label class="layui-form-label">{{T "Base Path"}}</label>
					<div class="layui-input-block">
					  <input type="text" name="basePath"  autocomplete="off" class="layui-input" value="{{.Data.BasePath}}">
					</div>
				</div>
				<div class="layui-form-item layui-col-md6">
					<label class="layui-form-label">JWT Key</label>
					<div class="layui-input-block">
					  <input type="text" name="jwttokenKey" lay-verify="required" lay-reqtext='{{T "Please fill in the JWT key"}}' autocomplete="off" class="layui-input" value="{{.Data.JwttokenKey}}">
					</div>
				  </div>
				<div class="layui-form-item layui-col-md6">
				  <label class="layui-form-label">JWT Secret</label>
				  <div class="layui-input-block">
					<input type="password" name="jwtSecret" lay-verify="required" lay-reqtext='{{T "Please fill in the JWT Secret"}}' autocomplete="off" class="layui-input" value="{{.Data.JwtSecret}}" lay-affix="eye">
				  </div>
				</div>
				<div class="layui-form-item layui-col-md6">
					<label class="layui-form-label">IP:Port</label>
					<div class="layui-input-block">
					  <input type="text" name="serverPort" lay-verify="required" lay-reqtext='{{T "Please fill in the IP:Port"}}' autocomplete="off" class="layui-input" value="{{.Data.ServerPort}}">
					</div>
				</div>
				<div class="layui-form-item layui-col-md6">
					<label class="layui-form-label">{{T "Language"}}</label>
					<div class="layui-input-block">
						<select name="locale" id="locale">
							<option value="zh-CN">简体中文</option>
							<option value="en-US">English</option>
						</select>
					</div>
				</div>
				<div class="layui-form-item layui-col-md6">
					<label class="layui-form-label">{{T "Timeout"}}</label>
					<div class="layui-input-block">
					  <input type="number" name="timeout" lay-verify="required" lay-reqtext="请填写超时时间" autocomplete="off" class="layui-input" value="{{.Data.Timeout}}">
					</div>
				</div>	
				<div class="layui-form-item layui-col-md6">
					<label class="layui-form-label">{{T "Max Request Size"}}</label>
					<div class="layui-input-block">
					  <input type="number" name="maxRequestBodySize"  autocomplete="off" class="layui-input" value="{{.Data.MaxRequestBodySize}}">
					</div>
				</div>	
				<div class="layui-form-item">
					<div class="layui-input-block">
					  <button type="submit" class="layui-btn layui-bg-blue" lay-submit lay-filter="gpress-form-ajax-update">{{T "Submit Changes"}}</button>
					  <button type="button" class="layui-btn layui-bg-red" lay-on="updatesql">{{T "Update SQL"}}</button>
					</div>
				</div>
			</form>
          </div>
        </div>
{{template "admin/bodyend.html"}}

<script>
	layui.use(function(){
	  var form = layui.form;
	  var layer = layui.layer;
	  var util = layui.util;
	  var $ =layui.jquery;

	  //选中状态
      $("#locale option[value='{{.Data.Locale}}']").attr("selected", true);
	  // 渲染全部表单
	  form.render(); 

	  
	  util.on('lay-on', {
		'updatesql': function(){
			layer.prompt(
			{title: '{{T "Please enter the update SQL"}}', formType: 2,btn: ['{{T "OK"}}', '{{T "Cancel"}}'],}, 
			function(value, index, elem){
				if(value === '') return elem.focus();
				$.ajax({
					url:basePath+"admin/updatesql",
					type:"POST",
					contentType: "application/json;charset=utf-8",
					dataType:"json",
			        data:JSON.stringify({"updateSQL":value}),
					error: function (result) {
						layer.msg('{{T "SQL execution failed!"}}'+result.responseJSON.message);
					},
					success:function(result){
						//console.log(result)
						if (result.statusCode == 1) {
							// 关闭 prompt
							layer.close(index);
							layer.msg('{{T "SQL executed successfully!"}}'+result.message);
						}else{
							layer.msg('{{T "SQL execution failed!"}}'+result.responseJSON.message);
						}
					}
				});
			});
		},
	  });

	  // 提交事件
	  form.on('submit(gpress-form-ajax-update)', function(data){
		var field = data.field; // 获取表单字段值
		field.sortNo=field.sortNo-0;
		field.status=field.status-0;
		field.timeout=field.timeout-0;
		field.maxRequestBodySize=field.maxRequestBodySize-0;
		const form = document.getElementById('gpress-form');
		$.ajax({
			url:form.action,
			type:form.method,
			contentType: "application/json;charset=utf-8",
			dataType:"json",
			data:JSON.stringify(field),
			error: function (result) {
				layer.msg('{{T "Update error!"}}'+result.responseJSON.message);
			},
			success:function(result){
				if (result.statusCode == 1) {
					layer.msg('{{T "Settings updated successfully, restart GPRESS to take effect!"}}');
				}else{
					layer.msg('{{T "Update failed!"}}');
				}
			}
		});
        return false; // 阻止默认 form 跳转
	  });
	});
	</script>
